<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList" @findClicked="findData" />
    <el-card shadow="never" :body-style="{ padding: '5px' }" class="mt10">
      <div slot="header" class="f16">
        <span style="font-weight: 600">{{ $t(`Print.CommandTheMainAndAuxiliaryMaterialsToMatchTheQuery`) }}</span>
      </div>
      <Table
        :tableHeader="tableHeader"
        :tableData="tableData"
        class="mt10"
        :TableHeight="50"
        :outTableHeight="160"
        :summaryData="summaryData"
        summary
        @currentRow="currentRow"
        :isLoading="isLoading"
      />
      <Table :tableHeader="tableHeader2" :tableData="tableData2" class="mt10" :TableHeight="25" :outTableHeight="160" :isLoading="isLoading2" />

      <PageModule :PageData="{ total, buttonS: true }" @pageSizeChange="handleSizeChange" @pageChange="handleCurrentChange" />
    </el-card>
    <el-card shadow="never" :body-style="{ padding: '0px 5px 5px' }">
      <div slot="header" class="f16">
        <span style="font-weight: 600">{{ $t(`Print.InstructionBOM`) }}</span>
      </div>
      <div class="formList2">
        <Find :OriginalFilter="{ static: true }" :formList="formList2" :searchImg="false" @findClicked="findData2" />
      </div>
      <Table
        :tableHeader="tableHeader3"
        :tableData="tableData3"
        :TableHeight="25"
        :outTableHeight="160"
        class="mt10"
        :summaryData="summaryData2"
        summary
      />
      <PageModule :PageData="{ total: total2 }" @pageSizeChange="handleSizeChange2" @pageChange="handleCurrentChange2" />
    </el-card>
  </div>
</template>
<script lang="ts">
import { defineComponent, onMounted, watch } from 'vue'
import { reactive, ref } from 'vue'
import 'dayjs/locale/zh-cn'
import service from '@/utils/request'
import { ElMessage } from 'element-plus'
import fileRequest from '@/utils/fileRequest'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'MaterialMatchingQueryB'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
const formList = ref<any>([
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '2023-5-5002',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入颜色',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入品牌',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'date',
    dateLabel: '交期',
    dateValue: ''
  },
  {
    type: 'date',
    dateLabel: '下单日期',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入订购单号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材质',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'date',
    dateLabel: '订购日期',
    dateValue: ''
  },
  {
    type: 'checkbox',
    checkboxLabel: '一裁',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '二裁',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '三裁',
    checked: true
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '导出'
  }
])
const formList2 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入颜色',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材料名称',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材料颜色',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'date',
    dateLabel: '订单交期',
    dateValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'checkbox',
    checkboxLabel: '一裁',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '二裁',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '三裁',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '有欠数',
    checked: true
  },
  {
    type: 'checkbox',
    checkboxLabel: '无欠数',
    checked: true
  },
  {
    type: 'button',
    checkboxLabel: '导出'
  }
]) as any
const currentLotNo = ref(
  formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
  )?.inputValue || ''
)

// 表一模块
// '置空'按钮
const findData = async (content: any) => {
  if (content === '置空') {
    formList.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
    })
  }
  if (content === '导出') {
    const res = (await fileRequest.put(`/pcFactorQuery/supp/mtlHead/export`, {
      color: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
      )?.inputValue,
      custom: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入品牌'
      )?.inputValue,
      deliveryEndDate: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '交期'
      )?.dateValue?.[1],
      deliveryStartDate: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '交期'
      )?.dateValue?.[0],
      lotNo: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
      )?.inputValue,
      orderEndDate: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '下单日期'
      )?.dateValue?.[1],
      orderStartDate: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '下单日期'
      )?.dateValue?.[0],
      pageNum: currentPage.value,
      pageSize: pageSize.value,
      style: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
      )?.inputValue,
      vendor: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
        ?.selectValue
    })) as any
    const link = document.createElement('a') // 利用a标签自定义下载文件名
    let blob = new Blob([res.data]) // 创建Blob对象，设置文件类型
    link.style.display = 'none'
    //设置连接
    link.href = window.URL.createObjectURL(blob)
    const FileName = decodeURI(res.headers['content-disposition'].split(`utf-8''`)[1])
    link.download = FileName //自定义文件名字
    document.body.appendChild(link)
    //模拟点击事件
    link.click()
    document.body.removeChild(link)
  }
}

const imgList = ref([])
const tableHeader = ref([
  {
    sortable: true,
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '订单量',
    prop: 'orderQty'
  },
  {
    label: '预补量',
    prop: 'surplusQty'
  },
  {
    label: '一裁',
    prop: 'cut_1',
    width: 30
  },
  {
    label: '二裁',
    prop: 'cut_2',
    width: 30
  },
  {
    label: '三裁',
    prop: 'cut_3',
    width: 30
  },
  {
    label: '客户',
    prop: 'custom'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '颜色',
    prop: 'color'
  },
  {
    label: '新旧款',
    prop: 'styleType'
  },
  {
    label: '冲刀',
    prop: 'cutNo'
  },
  {
    label: '楦头',
    prop: 'moldNo'
  },
  {
    label: '大底',
    prop: 'processSole'
  },
  {
    label: '大底厂商',
    prop: 'soleVendor'
  },
  {
    label: '下单日期',
    prop: 'orderDate'
  },
  {
    label: '交期',
    prop: 'deliveryTime'
  },
  {
    type: 'img',
    label: '图片',
    fixed: true,
    prop: 'photoPath',
    srcList: imgList
  },
  {
    Multistage: true,
    label: '冲裁',
    children: [
      {
        label: '组别',
        prop: 'cutDept'
      },
      {
        label: '欠数',
        prop: 'cutShort'
      },
      {
        label: '计划',
        prop: 'cutPlanDate'
      },
      {
        label: '实际',
        prop: 'cutActualDate'
      }
    ]
  },
  {
    Multistage: true,
    label: '工艺',
    children: [
      {
        label: '欠数',
        prop: 'hfShort'
      },
      {
        label: '计划',
        prop: 'hfPlanDate'
      },
      {
        label: '实际',
        prop: 'hfActualDate'
      }
    ]
  },
  {
    Multistage: true,
    label: '配套',
    children: [
      {
        label: '组别',
        prop: 'partProd'
      },
      {
        label: '欠数',
        prop: 'partShort'
      },
      {
        label: '计划',
        prop: 'partPlanDate'
      },
      {
        label: '实际',
        prop: 'partActualDate'
      }
    ]
  },
  {
    Multistage: true,
    label: '针车',
    children: [
      {
        label: '针车组别',
        prop: 'stitchDept'
      },
      {
        label: '欠数',
        prop: 'stitchShort'
      },
      {
        label: '计划',
        prop: 'stitchPlanDate'
      },
      {
        label: '实际',
        prop: 'stitchActualDate'
      }
    ]
  },
  {
    Multistage: true,
    label: '大底',
    children: [
      {
        label: '欠数',
        prop: 'soleShort'
      },
      {
        label: '计划',
        prop: 'solePlanDate'
      },
      {
        label: '实际',
        prop: 'soleActualDate'
      }
    ]
  },
  {
    Multistage: true,
    label: '成型',
    children: [
      {
        label: '成型组别',
        prop: 'lastDept'
      },
      {
        label: '欠数',
        prop: 'lastShort'
      },
      {
        label: '计划',
        prop: 'lastPlanDate'
      },
      {
        label: '实际',
        prop: 'lastActualDate'
      }
    ]
  }
])
const tableData = ref([])
// 总计
interface summaryDataType {
  index: number
  num: number | undefined
}
const summaryData = ref<summaryDataType[]>([
  {
    index: 1,
    num: 0
  },
  {
    index: 2,
    num: 0
  }
])
// 分页器
const currentPage = ref(1)
const pageSize = ref(40)
const total = ref(0)
const handleSizeChange = (val: number) => {
  pageSize.value = val
  getTableList()
}
const handleCurrentChange = (val: number) => {
  currentPage.value = val
  getTableList()
}
const isLoading = ref(true)
// 获取表数据
const getTableList = async () => {
  currentLotNo.value = formList.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
  )?.inputValue
  isLoading.value = true
  let tableDataList = await service.post<any, any>('/pcFactorQuery/queryMtlHead', {
    color: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
    )?.inputValue,
    custom: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入品牌'
    )?.inputValue,
    deliveryEndDate: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '交期'
    )?.dateValue?.[1],
    deliveryStartDate: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '交期'
    )?.dateValue?.[0],
    lotNo: currentLotNo.value,
    orderEndDate: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '下单日期'
    )?.dateValue?.[1],
    orderStartDate: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '下单日期'
    )?.dateValue?.[0],
    pageNum: currentPage.value,
    pageSize: pageSize.value,
    style: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
    )?.inputValue,
    vendor: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
      ?.selectValue
  })
  imgList.value = tableDataList.mtlhead.map((item: any) => {
    return item.photoPath
  })
  tableData.value = tableDataList.mtlhead
  total.value = tableDataList.total
  summaryData.value[0].num = tableDataList.sum[0].orderCount
  summaryData.value[1].num = tableDataList.sum[0].surplusCount
  currentRow()
  isLoading.value = false
}
onMounted(() => {
  getTableList()
})
watch(
  () =>
    formList.value.map((item: any) => {
      item.selectValue, item.inputValue, item.dateValue, item.checked
    }),
  () => {
    getTableList()
  }
)

// 表二模块
const tableData2 = ref([])
const tableHeader2 = ref([
  {
    width: '120px',
    label: '补料单号',
    prop: 'slipNo'
  },
  {
    label: '补料日期',
    prop: 'slipDate'
  },
  {
    label: '补料部门',
    prop: 'dutyDeptName'
  },
  {
    label: '开补数',
    prop: 'slipCount',
    width: '60px'
  },
  {
    label: '原材料',
    width: '50px',
    type: 'checkbox',
    prop: 'checkboxArrange'
  },
  {
    label: '完成日期',
    prop: 'shape',
    width: '55px'
  },
  {
    label: '冲裁',
    width: '50px',
    type: 'checkbox',
    prop: 'checkboxArrange'
  },
  {
    label: '完成日期',
    prop: 'shape',
    width: '50px'
  },
  {
    label: '工艺',
    width: '95px',
    type: 'checkbox',
    prop: 'checkboxArrange'
  },
  {
    label: '完成日期',
    prop: 'shape',
    width: '88px'
  },
  {
    label: '配套',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '50px'
  },
  {
    label: '完成日期',
    prop: 'shape',
    width: '70px'
  },
  {
    label: '针车',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '50px'
  },
  {
    label: '完成日期',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '69px'
  },
  {
    label: '大底',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '50px'
  },
  {
    label: '完成日期',
    width: '69px'
  },
  {
    label: '成型',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '50px'
  },
  {
    label: '完成日期',
    type: 'checkbox',
    prop: 'checkboxArrange',
    width: '69px'
  }
])

// 表三模块
const findData2 = async (content: any) => {
  if (content === '导出') {
    const res = (await fileRequest.put(`/pcFactorQuery/supp/mtlDet/export`, {
      color: formList2.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
      )?.inputValue, //	颜色	string	body	true
      custom: '', //	客户	string	body	true
      cutNum: '', //	裁数(在找)	string	body	true
      deliveryEndTime: formList2.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '订单交期'
      )?.dateValue?.[1], //	交期末	string	body	true
      deliveryStartTime: formList2.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '订单交期'
      )?.dateValue?.[0], //	交期始	string	body	true
      lotNo:
        formList2.value.find(
          (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
        )?.inputValue || '2023-5-5002', //	指令	string	body	true
      mtlColor: formList2.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入材料颜色'
      )?.inputValue, //	材料颜色	string	body	true
      mtlName: formList2.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入材料名称'
      )?.inputValue, //	材料名	string	body	true
      pageNum: currentPage2.value, //		integer	body	true
      pageSize: pageSize2.value, //		integer	body	true
      shortStatus: cfmFlag(), //	有无欠数(Y/N)	string	body	true
      style: formList2.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
      )?.inputValue //	型体	string	body	true
    })) as any
    const link = document.createElement('a') // 利用a标签自定义下载文件名
    let blob = new Blob([res.data]) // 创建Blob对象，设置文件类型
    link.style.display = 'none'
    //设置连接
    link.href = window.URL.createObjectURL(blob)
    const FileName = decodeURI(res.headers['content-disposition'].split(`utf-8''`)[1])
    link.download = FileName //自定义文件名字
    document.body.appendChild(link)
    //模拟点击事件
    link.click()
    document.body.removeChild(link)
  }
}

const tableHeader3 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '材料颜色',
    prop: 'mtlColor'
  },
  {
    label: '材料名称',
    prop: 'mtlName',
    width: 120
  },
  {
    label: '规格',
    prop: 'mtlSpec'
  },
  {
    label: '单位',
    prop: 'mtlUnit'
  },
  {
    label: '裁次',
    prop: 'cutSeq',
    width: '55px'
  },
  {
    label: '厂商',
    prop: 'vendorName',
    width: '95px'
  },
  {
    label: '采购交期',
    prop: 'inDate',
    width: '88px'
  },
  {
    label: '用量',
    prop: 'ttlUsage',
    width: '70px'
  },
  {
    label: '订单量',
    prop: 'purQty',
    width: '70px'
  },
  {
    label: '入库量',
    prop: 'recQty',
    width: '70px'
  },
  {
    label: '欠数',
    prop: 'shortQty',
    width: '70px'
  },
  {
    label: '尾数处理',
    prop: 'LastQty',
    width: '88px'
  },
  {
    label: '通用',
    prop: 'remark',
    width: '70px'
  },
  {
    label: '物料编码',
    prop: 'mtlNo',
    width: 150
  }
])
const tableData3 = ref([])
const isLoading2 = ref(true)

// 点击表一传给表二和表三指令号
const currentRow = async (row: any = tableData.value[0] ? tableData.value[0] : {}) => {
  if (row) {
    currentLotNo.value = row.lotNo
  }
  // 给表二传指令号
  isLoading2.value = true
  let table2Data = await service.get<any, any>(`/pcFactorQuery/queryMtlAttribute/${currentLotNo.value}`)
  isLoading2.value = false
  tableData2.value = table2Data.slip
  // 给表三传指令号
  const targetItem = formList2.value.find(
    (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
  )
  if (targetItem) {
    targetItem.inputValue = currentLotNo.value
  }
}
// 有无欠数计算函数
const cfmFlag = () => {
  const Unaudited = formList2.value.find((item: any) => item.type === 'checkbox' && i18n.global.t(item.checkboxLabel) === '有欠数')
  const Audited = formList2.value.find((item: any) => item.type === 'checkbox' && i18n.global.t(item.checkboxLabel) === '无欠数')
  if (!Unaudited || !Audited) return
  if (Unaudited.checked && Audited.checked) {
    return ''
  } else if (Unaudited.checked) {
    return 'N'
  } else if (Audited.checked) {
    return 'Y'
  } else {
    ElMessage('必须至少选择一项')
    Unaudited.checked = true
    Audited.checked = true
    return ''
  }
}
// 获取表数据
const getTable3List = async () => {
  let table3Data = await service.put<any, any>('/pcFactorQuery/queryMtlDetail', {
    color: formList2.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入颜色'
    )?.inputValue, //	颜色	string	body	true
    custom: '', //	客户	string	body	true
    cutNum: '', //	裁数(在找)	string	body	true
    deliveryEndTime: formList2.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '订单交期'
    )?.dateValue?.[1], //	交期末	string	body	true
    deliveryStartTime: formList2.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '订单交期'
    )?.dateValue?.[0], //	交期始	string	body	true
    lotNo:
      formList2.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
      )?.inputValue || '2023-5-5002', //	指令	string	body	true
    mtlColor: formList2.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入材料颜色'
    )?.inputValue, //	材料颜色	string	body	true
    mtlName: formList2.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入材料名称'
    )?.inputValue, //	材料名	string	body	true
    pageNum: currentPage2.value, //		integer	body	true
    pageSize: pageSize2.value, //		integer	body	true
    shortStatus: cfmFlag(), //	有无欠数(Y/N)	string	body	true
    style: formList2.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入型体'
    )?.inputValue //	型体	string	body	true
  })
  tableData3.value = table3Data.detail
  total2.value = table3Data.total
  summaryData2.value[0].num = table3Data.count
}
onMounted(() => {
  getTable3List()
})
watch(formList2.value, () => {
  getTable3List()
})
// 分页器
const currentPage2 = ref(1)
const pageSize2 = ref(40)
const total2 = ref(0)
const handleSizeChange2 = (val: number) => {
  pageSize2.value = val
  getTable3List()
}
const handleCurrentChange2 = (val: number) => {
  currentPage2.value = val
  getTable3List()
}
// 计算总计
const summaryData2 = ref<summaryDataType[]>([
  {
    index: 9,
    num: 0
  }
])

const selectList = async () => {
  let manufacturer = await service.put<any, any>('/pcFactorQuery/queryVendor')
  if (manufacturer) {
    manufacturer.forEach((item: any) => {
      if (item === null) return
      formList.value
        .find((item: any) => item.type === 'select' && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
        .selectOptions.push({
          optionValue: item,
          optionLabel: item
        })
      formList2.value
        .find((item: any) => item.type === 'select' && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
        .selectOptions.push({
          optionValue: item,
          optionLabel: item
        })
    })
  }
}
onMounted(() => {
  selectList()
})
</script>

<style lang="less" scoped>
.formList2 {
  :deep(.form) {
    display: grid;
  }

  :deep(.el-form) {
    justify-self: end;
  }
}

// table {
//   table-layout: auto !important;
// }

// :deep(.el-table__header) {
//   width: 100% !important;
// }

// :deep(.el-table__body) {
//   width: 100% !important;
// }
</style>
